<template>
	<view class="content">
		<view class="top">
			<view
				style="margin-left: 20rpx;width: 600rpx;height: 60rpx;background-color: white;line-height: 60rpx;text-align: center;display: inline-block;border-radius: 15rpx;">
				<image src="../../static/搜索.png" style="width: 25rpx;height: 25rpx;display: inline-block;" />
				<view style="display: inline-block;">
					搜索
				</view>
			</view>
			<view style="display: inline-block; margin-left: 20rpx;font-size: 30rpx;font-weight: bold;">
				搜索
			</view>
		</view>

		<view class="bottom">
			<uni-data-select v-model="value" :clear="false" :localdata="range" @change="change" label="应用选择"
				style="width: 200rpx; margin-bottom:30rpx ;" />
			<view style="display: flex; margin-bottom: 40rpx;" @click="tiaozhuan">
				<img src="../../static/小王美容汽车店.png"
					style="width: 182rpx;height: 164rpx; display: inline-block;margin-right: 20rpx;" alt="" />
				<view style="width: 508rpx; margin-bottom: ;">
					<view style="display: flex;">
						<view style="font-size: 33rpx;font-weight: bold;">伟业汽车维修厂(人民路店)</view>
						<view style="margin-left: 50rpx;font-size: 33rpx;font-weight: bold;color:#1D6FFF">44米</view>
					</view>
					<view class="" style="display: flex;">
						<uni-rate v-model="rateValue" readonly="true" @change="onChange" />
						<view style="margin-left: 20rpx;font-size: 28rpx;">{{rateValue}}</view>
						<view style="font-size: 28;font-weight: bold;margin-left:100rpx;"> 销量: 322</view>
					</view>
					<view style="font-weight: bold;">营业时间：周一至周五 09:00-22:00</view>
					<view style="font-weight: bold;">
						山阳区人民中路32号
					</view>
				</view>
			</view>
		</view>
		<view style="width: 720rpx;border-top: 2rpx solid aliceblue; text-align: center;margin-top: 20rpx;">
			暂无更多
		</view>
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				rateValue: 3,
				value: 0,
				serviceType: 1,
				range: [{
						value: 0,
						text: "综合排序"
					},
					{
						value: 1,
						text: "距离最近"
					},
					{
						value: 2,
						text: "评分最高"
					},
					{
						value: 2,
						text: "销量最高"
					},
				]
			}
		},
		onLoad: (options) => {
			//拿到首页传递的服务类型id
			
			//根据服务类型id查询有该服务的店铺
		},
		methods: {
			onChange(e) {
				console.log('rate发生改变:' + JSON.stringify(e))
				// console.log(this.rateValue);
			},
			tiaozhuan() {
				uni.navigateTo({
					url: "/pages/storedetail/storedetail"
				})
			},
			change(e) {
				console.log("e:", e);
			},
		}
	}
</script>

<style>
	page {
		background-color: white;
	}

	.content {
		/* padding-top: 20rpx; */
	}

	.top {
		width: 750rpx;
		background-color: #EFEFF5;
		height: 100rpx;
		line-height: 100rpx;
	}

	.bottom {
		width: 750rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		padding-top: 30rpx;
		padding-bottom: 20rpx;
	}
</style>